<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Bootstrap Grid Demo</title>
</head>
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="../bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->
<!-- CSS -->
<link href="../bower_components/normalize-less/normalize.less" rel="stylesheet/less"/>
<link href="../bower_components/bootstrap/dist/css/bootstrap.css" rel="stylesheet"/>
<link rel="stylesheet/less" type="text/css" href="Grid.less">
<!-- CSS -->
<style type="text/less">
    .wrap-col {
        min-height: 50px;
        line-height: 50px;
        /*margin: 5px;*/
        text-align: center;
        color: #cccccc;
        font-size: 1rem;
        background-color: #2d6987;
    }

    [class*='col-md-'] {
        margin-top: 5px;
        margin-bottom: 5px;
    }
</style>
<body>

<h1>BootStrap Grid Demo</h1>

<div class="row">
    <div class="col-md-12">
        <div class="wrap-col">
            .col-md-12
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-6">
        <div class="wrap-col">
            .col-md-6
        </div>
    </div>
    <div class="col-md-6">
        <div class="wrap-col">
            .col-md-6
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-4">
        <div class="wrap-col">
            .col-md-4
        </div>
    </div>
    <div class="col-md-4">
        <div class="wrap-col">
            .col-md-4
        </div>
    </div>
    <div class="col-md-4">
        <div class="wrap-col">
            .col-md-4
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-3">
        <div class="wrap-col">
            .col-md-3
        </div>
    </div>
    <div class="col-md-3">
        <div class="wrap-col">
            .col-md-3
        </div>
    </div>
    <div class="col-md-3">
        <div class="wrap-col">
            .col-md-3
        </div>
    </div>
    <div class="col-md-3">
        <div class="wrap-col">
            .col-md-3
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-2">
        <div class="wrap-col">
            .col-md-2
        </div>
    </div>
    <div class="col-md-2">
        <div class="wrap-col">
            .col-md-2
        </div>
    </div>
    <div class="col-md-2">
        <div class="wrap-col">
            .col-md-2
        </div>
    </div>
    <div class="col-md-2">
        <div class="wrap-col">
            .col-md-2
        </div>
    </div>
    <div class="col-md-2">
        <div class="wrap-col">
            .col-md-2
        </div>
    </div>
    <div class="col-md-2">
        <div class="wrap-col">
            .col-md-2
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
    <div class="col-md-1">
        <div class="wrap-col">
            .col-md-1
        </div>
    </div>
</div>

</body>
<!-- JS -->
<script type="text/javascript" src="../bower_components/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../bower_components/less.js/dist/less-1.5.1.min.js"></script>
<script type="text/javascript" src="../bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../Bustling/js/Bustling_Grid.js"></script>
<!-- JS -->
<script type="text/javascript">
</script>
</html>